﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>用户列表</title>
    <meta charset="utf-8" />
    <link href="../themes/icon.css" rel="stylesheet" />
    <link href="../themes/default/easyui.css" rel="stylesheet" />
    <script src="../Scripts/jquery-1.7.1.js"></script>
    <script src="../Scripts/jquery.min.js"></script>
    <script src="../Scripts/jquery.easyui.min.js"></script>
    <style type="text/css">
        .Main_Shop {
            width: 100%;
            height: 100%;
            background-color: rgb(224,224,224);
        }
    </style>
    <script type="text/javascript">
        $().ready(function () {
            $('#tb').datagrid({
                fitColumns: true,//自动放大，适应宽度，防止滚动
                url: '../jquery-easyui-1.4.3/demo/datagrid/datagrid_data1.json',
                method: "get",
                toolbar: "#db",//制定的工具栏
                pagination: true,//如果为true，显示分页工具栏
                rownumbers: true,//如果为true，则显示一个行号列
                singleSelect: true,//如果为true则只允许选择一行
                columns: [[
                    { field: 'productid', title: '礼品编号', width: 100 },
                    { field: 'productname', title: '礼品代号', width: 100 },
                    { field: 'unitcost', title: '礼品名称', width: 100, align: 'center' },
                    { field: 'productid', title: '所需积分', width: 100 },
                    { field: 'productname', title: '礼品数量', width: 100 },
                    { field: 'unitcost', title: '已兑换数量', width: 100, align: 'center' },
                { field: 'unitcost', title: '备注', width: 100, align: 'center' }
                ]]
            });
            //新增
            $("#btnAdd").click(function () {
                $("#dd").dialog({ width: 400, height: 300, left: 400, top: 0 })
                .dialog("setTitle", "新增礼品").dialog("open");
                $("#frm1").attr("src","Addgift.html");

            });
            //修改
            $("#btnUpdate").click(function () {
                var row = $("#tb").datagrid("getSelected");
                if (row != null)
                {
                    $("#dd").dialog({ width: 400, height: 300, left: 400, top: 0 })
                .dialog("setTitle", "修改礼品").dialog("open");
                    $("#frm1").attr("src", "Addgift.html");
                }
                else
                {
                    alert('请先选择所需修改的用户的信息');
                }
            });
            //删除
            $("#btnDelete").click(function () {
                var row = $("#tb").datagrid("getSelected");
                if (row != null)
                {
                    if(confirm('确定要删除此用户信息吗？')){}
                }
                else
                {
                    alert('请先选择所需删除的用户的信息');
                }
            });
        });
    </script>
</head>
<body>
    <div class="Main_Shop">
        <!-- 按钮 -->
        <div>
            <a id="btnAdd" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'">新增</a>
            <a id="btnUpdate" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">修改</a>
            <a id="btnDelete" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'">删除</a>
        </div>
        <!-- 条件 -->
        <div id="db">
            <label for="name">登录名:</label>
            <input class="easyui-textbox" type="text" name="txtLoginName"></input>
            <label for="name">真实姓名:</label>
            <input class="easyui-textbox" type="text" name="txtRealName"></input>
            <label for="name">联系电话:</label>
            <input class="easyui-textbox" type="text" name="txtPeople"></input>
            <a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a>
        </div>
        <!-- 弹窗 -->
        <div id="dd" class="easyui-dialog" data-options="closed:true" style="margin-top:0px;overflow:hidden; ">
            <iframe id="frm1" width="100%" height="100%" frameborder="0"></iframe>
        </div>
        <!-- 表格 -->
        <table id="tb"></table>
    </div>
</body>
</html>
